import { sendEmail } from '@/services/api';
import {
  DrawerForm,
  ProFormInstance,
  ProFormSelect,
  ProFormText,
} from '@ant-design/pro-components';
import { Form, message } from 'antd';
import React, { useEffect, useRef } from 'react';

interface Props {
  open?: boolean;
  info?: any;
  close?: () => void;
}
// 新增编辑客户
const SendEmail: React.FC<Props> = ({ open, close, info }) => {
  const [form] = Form.useForm<{ name: string; company: string }>();

  const formRef = useRef<ProFormInstance>();

  useEffect(() => {
    if (info) {
      formRef?.current?.setFieldsValue({
        ...info,
      });
    }
  }, [info]);

  // const { data: emailData } = useRequest(async () => {
  //   const { data } = await getEmail();
  //   return data;
  // });

  // const { data: phraseData } = useRequest(async () => {
  //   const { data } = await getPhraseOption();
  //   return data;
  // });

  return (
    <DrawerForm
      formRef={formRef}
      title={'发送邮箱'}
      form={form}
      open={open}
      width={'38%'}
      onOpenChange={(visible) => {
        if (!visible) {
          close?.();
        }
      }}
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      onFinish={async (values) => {
        try {
          const { msg } = await sendEmail({
            ...values,
            recipientEmail: info.email,
          });
          // await waitTime(2000);
          message.success(msg || '提交成功');
          // 不返回不会关闭弹框
          return true;
        } catch (error) {}
      }}
    >
      <ProFormSelect
        name="emailId"
        label="发送邮箱"
        width="lg"
        options={emailData?.map((_email: any) => {
          return {
            value: _email.id,
            label: _email.name,
          };
        })}
        rules={[
          {
            required: true,
          },
        ]}
      />

      <ProFormText
        label="收件人"
        width="lg"
        fieldProps={{
          value: `${info.name}(${info.email})`,
          disabled: true,
        }}
      />

      <ProFormSelect
        // name="emailId"
        label="话术设置"
        width="lg"
        options={phraseData?.map((_email: any) => {
          return {
            value: _email.id,
            label: _email.name,
          };
        })}
        onChange={(id: number) => {
          console.log('id', id);
          const findphrase = phraseData.find((_item) => _item.id === id);
          console.log('findphrase', findphrase);
          formRef?.current?.setFieldsValue({
            ...findphrase,
          });
        }}
      />
      <ProFormText
        width="lg"
        name="subject"
        label="邮箱主题"
        placeholder="请输入邮箱主题"
        rules={[
          {
            required: true,
          },
        ]}
      />
      <ProFormText
        width="lg"
        name="content"
        label="邮箱内容"
        placeholder="请输入邮箱内容"
        rules={[
          {
            required: true,
          },
        ]}
      />
    </DrawerForm>
  );
};

export default SendEmail;
